<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>最佳拍档</title>
    <meta name="keywords" content="最佳拍档">
    <meta name="description" content="最佳拍档">
    <style type="text/css">
        .app-item{
            display: flex;
            flex-direction: column;
            justify-content: center;
            margin: 20px;
        }
        .app-item-icon{
            background-color: #009688;
            width: 100px;
            height: 100px;
            border-radius: 10px;
            display: flex;
        }
        .icon-div{
            align-self: center;
            margin: 0 auto;
        }
        .app-item-text{
            width: 100px;
            white-space:nowrap;
            overflow:hidden;
            text-overflow:ellipsis;
            text-align: center;
        }
        .line-height65{
            line-height: 65px;
        }
        .app-item2{
            display: flex;
            width: 200px;
            height: 65px;
            background-color: #c0c4cc;
            border-radius: 5px;
            margin: 5px;
            cursor: pointer;
        }
        .app-item2-text{
            width: 150px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    </style>
</head>
<body>
    <div>
        <div style="display: flex;justify-content: center;padding-top: 50px;">
            <div style="width: 400px;">
                <input type="text" name="keyword" id="keyword" placeholder="请输入关键字" autocomplete="off" class="layui-input" onkeydown="keydownSearch()">
            </div>
            <div style="padding-left: 5px;">
                <button type="button" class="layui-btn" onclick="search()">搜索</button>
            </div>
        </div>
        <div style="padding-top: 20px;width: 98%;margin: 0 auto;border-bottom: 1px solid #dfd8d8;"></div>
        <div style="display: flex;flex-wrap: wrap;padding-top: 10px;">
            <div class="app-item2" th:onclick="toRuleList()">
                <div class="u-pl-5 line-height65">
                    <i class="layui-icon layui-icon-list" style="font-size: 35px; color: #1e1d1d;"></i>
                </div>
                <div class="line-height65 app-item2-text">
                    测试应用1
                </div>
            </div>
            <div class="app-item2">
                <div class="u-pl-5 line-height65">
                    <i class="layui-icon layui-icon-list" style="font-size: 35px; color: #1e1d1d;"></i>
                </div>
                <div class="line-height65 app-item2-text">
                    CMM评审电子测评
                </div>
            </div>
            <div class="app-item2">
                <div class="u-pl-5 line-height65">
                    <i class="layui-icon layui-icon-list" style="font-size: 35px; color: #1e1d1d;"></i>
                </div>
                <div class="line-height65 app-item2-text">
                    接龙场景
                </div>
            </div>
            <div class="app-item2">
                <div class="u-pl-5 line-height65">
                    <i class="layui-icon layui-icon-list" style="font-size: 35px; color: #1e1d1d;"></i>
                </div>
                <div class="line-height65 app-item2-text">
                    试用评测
                </div>
            </div>
<!--            <div class="app-item">-->
<!--                <div class="app-item-icon" th:onclick="toRuleList()">-->
<!--                    <div class="icon-div">-->
<!--                        <i class="layui-icon layui-icon-list" style="font-size: 50px; color: #fbfbfb;"></i>-->
<!--                    </div>-->
<!--                </div>-->
<!--                <div class="app-item-text">-->
<!--                    CMM评审电子测评-->
<!--                </div>-->
<!--            </div>-->
<!--            <div class="app-item">-->
<!--                <div class="app-item-icon" th:onclick="toRuleList()">-->
<!--                    <div class="icon-div">-->
<!--                        <i class="layui-icon layui-icon-list" style="font-size: 50px; color: #fbfbfb;"></i>-->
<!--                    </div>-->
<!--                </div>-->
<!--                <div class="app-item-text">-->
<!--                    审计电子流-->
<!--                </div>-->
<!--            </div>-->
<!--            <div class="app-item">-->
<!--                <div class="app-item-icon" th:onclick="toRuleList()">-->
<!--                    <div class="icon-div">-->
<!--                        <i class="layui-icon layui-icon-list" style="font-size: 50px; color: #fbfbfb;"></i>-->
<!--                    </div>-->
<!--                </div>-->
<!--                <div class="app-item-text">-->
<!--                    互联工程设计电路板-->
<!--                </div>-->
<!--            </div>-->
        </div>
    </div>
</body>

<script type="text/javascript">

    window.onload=function(){
        $('a[href="/tab/App_AppCenter"]').parent().addClass('layui-this');
    }

    //点击某个应用跳转到规则列表
    function toRuleList() {
        window.location.href = "/tab/App_RuleList/123456"
    }
</script>

</html>